import { modalInputValidators, operateType } from "./store";
import { fetchList } from ".";
import { ModalFormStateType } from "./type";
export const modalLoading = ref(false);
export const modalVisible = ref(false);
export const modalFormState = reactive<ModalFormStateType>({
  id: undefined,
  password_old: undefined,
  password_new: undefined,
  password_new_confirmation: undefined,
});
export const defaultModalFormState = deepClone(modalFormState);
export const modalTitle = ref("");
export const modalConfig = () => {
  const modal_disable_ok_button = computed(() => {
    const { formState } = defineModal;
    return (
      isEmptyType(formState.password_new) ||
      isEmptyType(formState.password_new_confirmation) ||
      modalInputValidators.some((bool) => bool === true)
    );
  });
  const defineModal = {
    modalInstance: ref(null),
    loading: modalLoading,
    visible: modalVisible,
    maskClosable: true,
    disable_ok_button: modal_disable_ok_button,
    title: modalTitle,
    formState: modalFormState,
    reverse: ref(true),

    on: {
      async finish(values: any) {
        const { formState, loading, visible } = defineModal;
        try {
          loading.value = true;
          switch (operateType.value) {
            case "update->password":
              const res = reactive<any>(
                await businessApi.updatePsd({
                  merchant_uid: formState.id,
                  password_new: formState.password_new,
                  password_new_confirmation:
                    formState.password_new_confirmation,
                })
              );
              if (res.code != 200) return message.error(res.message);
              message.success($t("base.updateSucess"));
              break;
          }
          visible.value = false;
          fetchList();
        } catch (error: any) {
          message.error(error.message);
        } finally {
          loading.value = false;
        }
      },
    },
    modalList: [
      {
        label: getProxyT("table71"),
        name: "password_new",
        maxlength: 13,
        type: "inputPassword",
        model: "password_new",
        placeholder: getProxyT("placeholder0"),
        rules: [
          {
            required: true,
            validator: password_new_confirm_validate({
              formState: modalFormState,
              keyArray: ["password_new_confirmation"],
              inputValidators: modalInputValidators,
              index: 0,
              callback: () => {
                defineModal.modalInstance?.value?.refs?.formValidate?.clearValidate?.(
                  ["password_new_confirmation"]
                );
                modalInputValidators[0] = false;
                modalInputValidators[1] = false;
              },
            }),
            trigger: "change",
          },
        ],
      },
      {
        label: getProxyT("table70"),
        name: "password_new_confirmation",
        maxlength: 13,
        type: "inputPassword",
        model: "password_new_confirmation",
        placeholder: getProxyT("placeholder1"),
        rules: [
          {
            required: true,
            validator: password_new_validate({
              formState: modalFormState,
              inputValidators: modalInputValidators,
              index: 1,
              keyArray: ["password_new"],
              callback: () => {
                defineModal.modalInstance?.value?.refs?.formValidate?.clearValidate?.(
                  ["password_new"]
                );
                modalInputValidators[0] = false;
                modalInputValidators[1] = false;
              },
            }),
            trigger: "change",
          },
        ],
      },
    ],
  };
  return defineModal;
};
